import { AfterViewInit, Component, ElementRef, OnInit, QueryList, ViewChild, ViewChildren } from '@angular/core';
import { PanelComponent } from './panel/panel.component';

@Component({
  selector: 'app-view-child',
  templateUrl: './view-child.component.html',
  styles: [
  ]
})
export class ViewChildComponent implements OnInit, AfterViewInit {
  @ViewChild('box', { static: true }) private boxEl: ElementRef;
  // @ViewChild(PanelComponent, { static: true }) private panelInstance: PanelComponent;
  @ViewChild('panel', { static: true }) private panelInstance2: PanelComponent;
  @ViewChildren('box') private boxels: QueryList<ElementRef>;
  @ViewChildren(PanelComponent) private panelInstances: QueryList<PanelComponent>;
  showChildOne = true;
  constructor() { }

  ngOnInit(): void {
    // console.log('在 ngOnInit 生命周期--', this.boxEl);
  }

  ngAfterViewInit(): void {
    // console.log('在 ngAfterViewInit 生命周期--', this.boxEl);
    // alert(this.panelInstance.name);
    // console.log('test--', this.panelInstance2.el.nativeElement);
    // console.log('test--', this.boxels);
    // console.log('test--', this.panelInstances);
    this.panelInstances.changes.subscribe(change => {
      console.log('test55--', change);
    })
  }

}
